<template>
  <px-dialog v-model="visible" title="文件详情" @close="cancel">
    <p>
      <span class="label">文件名称：</span><span class="content">{{ fileDetailData.name || "" }}</span>
    </p>
    <p>
      <span class="label">文件大小：</span><span class="content">{{ formatBytes(fileDetailData.fileSize) || "" }}</span>
    </p>
    <p>
      <span class="label">修改人：</span><span class="content">{{ fileDetailData.updateByName || "" }}</span>
    </p>
    <p>
      <span class="label">修改时间：</span><span class="content">{{ fileDetailData.updateTime || "" }}</span>
    </p>
    <p>
      <span class="label">文件路径：</span><span class="content">{{ fileDetailData.path || "" }}</span>
    </p>
  </px-dialog>
</template>

<script setup>
import { computed } from "vue";
import { formatBytes } from "@/views/all/knowledge/utils";

const props = defineProps({
  visible: {
    type: Boolean,
    default: false
  },
  fileDetailData: {
    type: Object,
    default: () => {}
  }
});
const emits = defineEmits(["update:visible"]);

const visible = computed({
  get: () => props.visible,
  set: val => emits("update:visible", val)
});

// const byteToMb = bytes => {
//   return (bytes / 1024 / 1024).toFixed(4);
// };

const cancel = () => {
  emits("update:visible", false);
};
</script>

<style lang="scss" scoped>
p {
  line-height: 36px;

  .label {
    display: inline-block;
    width: 80px;
    color: #000;
    text-align: right;
  }
}
</style>
